(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[950],{7312:function(e,t,s){(window.__NEXT_P=window.__NEXT_P||[]).push(["/svg/[[...param]]",function(){return s(6999)}])},5415:function(e,t,s){"use strict";s.d(t,{Z:function(){return n}});var i=s(5893),r=s(6057),a=s.n(r);function n(){return(0,i.jsx)("div",{className:a().loading})}},8639:function(e,t,s){"use strict";s.d(t,{Z:function(){return v}});var i=s(5893),r=s(3374),a=s.n(r),n=s(7294),l=s(1304),o=s.n(l),c=s(1664),h=s.n(c),d=s(5415),g=s(4243),p=s(4101),m=s(4956),x=s.n(m),u=e=>{let{vector:t,loading:s,state:r,sentUrl:a}=e;t&&!t.title&&(t.title=t.slug),t&&!t.slug&&(t.slug=o()(t.title.replace(/[*+~.()"!:@]/g," "))),t&&!t.url&&(t.url="/show/".concat(t.id,"/").concat(t.slug,".svg")),t&&(t.title=(0,p.Z)(t.title));let[l,c]=(0,n.useState)(!1);(0,n.useEffect)(()=>{c(!!t&&g.Z.checkSavedStatus(t.id))},[]);let m=()=>{window.location=t.url.replace("/show/","/download/")};return(0,i.jsxs)("div",{className:x().Node,children:[(0,i.jsxs)("div",{className:x().NodeImage,children:[!1===t&&(0,i.jsx)(d.Z,{}),s&&(0,i.jsx)(d.Z,{}),t&&!a&&(0,i.jsxs)(h(),{href:"/svg/".concat(t.id,"/").concat(t.slug),title:"Show "+t.title+" SVG File",itemScope:!0,itemType:"http://schema.org/ImageObject",children:[(0,i.jsx)("img",{itemProp:"contentUrl",src:"https://www.svgrepo.com"+t.url,alt:t.title+" SVG File",title:t.title+" SVG File",width:150,height:150}),(0,i.jsx)("meta",{itemProp:"name",content:"".concat(t.title," SVG Icon")}),(0,i.jsx)("span",{itemProp:"creator",itemScope:!0,itemType:"http://schema.org/Organization",children:(0,i.jsx)("meta",{itemProp:"name",content:"SVG Repo"})}),(0,i.jsx)("meta",{itemProp:"author",content:"SVG Repo"}),(0,i.jsx)("meta",{itemProp:"creditText",content:"SVG Repo"}),(0,i.jsx)("meta",{itemProp:"copyrightNotice",content:"CC0"}),(0,i.jsx)("meta",{itemProp:"license",content:"https://www.svgrepo.com/page/licensing/"}),(0,i.jsx)("meta",{itemProp:"acquireLicensePage",content:"https://www.svgrepo.com/page/licensing/"}),(0,i.jsx)("meta",{itemProp:"url",content:"https://www.svgrepo.com/svg/".concat(t.id,"/").concat(t.slug)})]}),t&&a&&(0,i.jsx)("a",{href:"/svg/".concat(t.id,"/").concat(t.slug),target:"_blank",onClick:()=>setTimeout(()=>{window.location.assign(a)},100),children:(0,i.jsx)("img",{itemProp:"contentUrl",src:"https://www.svgrepo.com"+t.url,alt:t.title+" SVG File",title:t.title+" SVG File",width:150,height:150})})]}),(0,i.jsxs)("div",{className:x().action,children:[(0,i.jsx)("svg",{className:l?x().saved:"",onClick:()=>{c(!l),g.Z.saveVector(String(t.id),t.slug)},title:"Like "+t.title+" SVG File",width:"21",height:"21",viewBox:"0 0 24 24",fill:"none",stroke:"#8899a4",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,i.jsx)("path",{d:"M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"})}),(0,i.jsx)("svg",{onClick:()=>m(),width:"21",height:"21",viewBox:"0 0 24 24",fill:"none",stroke:"#8899a4",strokeWidth:"2",strokeLinecap:"square",strokeLinejoin:"arcs",children:(0,i.jsx)("path",{d:"M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 9l-5 5-5-5M12 12.8V2.5"})}),(0,i.jsxs)("span",{className:x().actionTitle,children:[t.title," SVG Icon"]})]})]})};function v(e){let{nodes:t,loading:s,sentUrl:r,style:n}=e;return t?(0,i.jsx)("div",{className:a().nodeListing,style:n,children:t.map((e,t)=>(0,i.jsx)(u,{vector:e,loading:s,sentUrl:0==t?r:null},e?e.id+"-"+t:t))}):null}},4101:function(e,t,s){"use strict";function i(e){for(var t=(e=e.replace(/-/g," ")).toLowerCase().split(" "),s=0;s<t.length;s++)t[s]=t[s].charAt(0).toUpperCase()+t[s].substring(1);return t.join(" ").replace(" Ui "," UI ")}s.d(t,{Z:function(){return i}})},6999:function(e,t,s){"use strict";s.r(t),s.d(t,{__N_SSP:function(){return G},config:function(){return T},default:function(){return P}});var i=s(5893),r=s(7294),a=s(1163);s(9008);var n=s(1664),l=s.n(n),o=s(5675),c=s.n(o),h=s(4243),d=s(4101),g=s(4188),p=s.n(g),m=s(1304),x=s.n(m),u=s(9582),v=s(8955),f=s(8639),j=s(640),w=s.n(j);function C(e){let{slug:t,width:s=26,height:r=26,fill:a="#555",transform:n}=e;switch(t){case"close":return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 15 15",fill:a,width:s,height:r,children:(0,i.jsx)("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z",fill:"currentColor"})});case"loading":return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:a,width:s,height:r,children:(0,i.jsx)("path",{d:"M 12 2 C 10.895431 2 10 2.8954305 10 4 C 10 5.1045695 10.895431 6 12 6 C 13.104569 6 14 5.1045695 14 4 C 14 2.8954305 13.104569 2 12 2 z M 18.5 5 C 17.119288 5 16 6.1192881 16 7.5 C 16 8.8807119 17.119288 10 18.5 10 C 19.880712 10 21 8.8807119 21 7.5 C 21 6.1192881 19.880712 5 18.5 5 z M 5.5 5.1875 C 4.5058875 5.1875 3.6875 6.0058875 3.6875 7 C 3.6875 7.9941125 4.5058875 8.8125 5.5 8.8125 C 6.4941125 8.8125 7.3125 7.9941125 7.3125 7 C 7.3125 6.0058875 6.4941125 5.1875 5.5 5.1875 z M 3.5 11 C 2.6715729 11 2 11.671573 2 12.5 C 2 13.328427 2.6715729 14 3.5 14 C 4.3284271 14 5 13.328427 5 12.5 C 5 11.671573 4.3284271 11 3.5 11 z M 19 13 C 17.343146 13 16 14.343146 16 16 C 16 17.656854 17.343146 19 19 19 C 20.656854 19 22 17.656854 22 16 C 22 14.343146 20.656854 13 19 13 z M 5 16.8125 C 4.3372583 16.8125 3.8125 17.337258 3.8125 18 C 3.8125 18.662742 4.3372583 19.1875 5 19.1875 C 5.6627417 19.1875 6.1875 18.662742 6.1875 18 C 6.1875 17.337258 5.6627417 16.8125 5 16.8125 z M 10 20 C 9.4477153 20 9 20.447715 9 21 C 9 21.552285 9.4477153 22 10 22 C 10.552285 22 11 21.552285 11 21 C 11 20.447715 10.552285 20 10 20 z"})});case"flip":return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",fill:a,width:s,height:r,transform:n,children:(0,i.jsx)("path",{d:"M 8 1 L 8 13 L 14 13 L 8 1 z M 7 1.0058594 L 1.0078125 13 L 7 13 L 7 1.0058594 z M 6 5.2441406 L 6 12 L 2.6230469 12 L 6 5.2441406 z"})});case"rotate":return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",fill:a,width:s,height:r,transform:n,children:(0,i.jsx)("path",{d:"M 8 0 L 8 2 C 4.6918661 2 2 4.6918661 2 8 C 2 11.308134 4.6918661 14 8 14 C 11.128681 14 13.731761 11.6118 13.998047 8.5429688 A 0.50005 0.50005 0 1 0 13.001953 8.4570312 C 12.780239 11.0122 10.621319 13 8 13 C 5.2321339 13 3 10.767866 3 8 C 3 5.2321339 5.2321339 3 8 3 L 8 5 L 11 2.5 L 8 0 z M 12.5 4 A 0.5 0.5 0 0 0 12 4.5 A 0.5 0.5 0 0 0 12.5 5 A 0.5 0.5 0 0 0 13 4.5 A 0.5 0.5 0 0 0 12.5 4 z M 13.5 6 A 0.5 0.5 0 0 0 13 6.5 A 0.5 0.5 0 0 0 13.5 7 A 0.5 0.5 0 0 0 14 6.5 A 0.5 0.5 0 0 0 13.5 6 z"})});case"rotate:arrow":return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",fill:a,width:s,height:r,transform:n,children:(0,i.jsx)("path",{strokeWidth:"0",d:"M8.88,0V2.349H3.258a.6.6,0,0,0-.548.6.534.534,0,0,0,.548.57H8.88V5.872l3.29-2.936ZM-.54,2.349a.569.569,0,0,0-.548.587.569.569,0,0,0,.548.587.569.569,0,0,0,.548-.587A.569.569,0,0,0-.54,2.349Zm2.055,0a.569.569,0,0,0-.548.587.569.569,0,0,0,.548.587.569.569,0,0,0,.548-.587A.569.569,0,0,0,1.516,2.349Z",transform:"translate(5.06400 13.54100) rotate(-90) scale(1.1)"})});case"bg:none":return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",width:s,height:r,stroke:a,fill:"transparent",strokeWidth:"1",strokeDasharray:"2",children:(0,i.jsx)("rect",{x:"1",y:"1",width:"14",height:"14",rx:"0",fill:"transparent"})});case"bg:square":return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",width:s,height:r,stroke:a,fill:"transparent",strokeWidth:"1",children:(0,i.jsx)("rect",{x:"1",y:"1",width:"14",height:"14",rx:"0",fill:"transparent"})});case"bg:hexagon":return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",width:s,height:r,stroke:a,fill:"transparent",strokeWidth:"1.5",children:(0,i.jsx)("path",{transform:"translate(2,2)",fill:"none",d:"M9.166.33a2.25 2.25 0 00-2.332 0l-5.25 3.182A2.25 2.25 0 00.5 5.436v5.128a2.25 2.25 0 001.084 1.924l5.25 3.182a2.25 2.25 0 002.332 0l5.25-3.182a2.25 2.25 0 001.084-1.924V5.436a2.25 2.25 0 00-1.084-1.924L9.166.33z"})});case"bg:circle":return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",width:s,height:r,stroke:a,fill:"transparent",strokeWidth:"1.2",children:(0,i.jsx)("rect",{x:"1",y:"1",width:"14",height:"14",rx:"7",fill:"transparent"})});case"bg:blob":return(0,i.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 40 40",width:s,height:r,stroke:a,fill:"transparent",strokeWidth:"3",children:(0,i.jsx)("path",{fill:"none",d:"M21.5856 8.93747C24.1222 10.1824 28.7589 8.54461 32.6083 9.46898C36.4577 10.3934 39.5199 13.8799 37.1913 15.2185C34.8627 16.5571 27.1434 15.7478 23.9803 18.2435C20.8171 20.7391 22.2102 26.5396 20.617 31.0769C19.0239 35.6142 14.4445 38.8883 12.514 36.6969C10.5835 34.5054 11.3019 26.8485 9.45474 22.5957C7.60761 18.3429 3.19498 17.4943 2.21843 15.6908C1.24187 13.8872 3.7014 11.1287 6.38819 9.81508C9.07499 8.50151 11.9891 8.63289 13.9916 7.14413C15.9942 5.65536 17.0852 2.54645 17.8489 3.05575C18.6126 3.56505 19.0491 7.69258 21.5856 8.93747Z"})});case"random":return(0,i.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",width:s,height:r,strokeWidth:"0",fill:a,children:[(0,i.jsx)("path",{d:"M5 4a1 1 0 000 2h.01a1 1 0 000-2H5zM7 8a1 1 0 011-1h.01a1 1 0 010 2H8a1 1 0 01-1-1zM11.01 10a1 1 0 100 2h.01a1 1 0 100-2h-.01z"})," ",(0,i.jsx)("path",{fillRule:"evenodd",d:"M3.25 1A2.25 2.25 0 001 3.25v9.5A2.25 2.25 0 003.25 15h9.5A2.25 2.25 0 0015 12.75v-9.5A2.25 2.25 0 0012.75 1h-9.5zM2.5 3.25a.75.75 0 01.75-.75h9.5a.75.75 0 01.75.75v9.5a.75.75 0 01-.75.75h-9.5a.75.75 0 01-.75-.75v-9.5z",clipRule:"evenodd"})]});default:return null}}var _=s(8102),k=s(1803);function S(e,t){return Math.floor(Math.random()*(t-e+1))+e}var N=s(4762),y=s(1697),b=s.n(y);class L extends r.Component{componentDidMount(){this.props.icon&&("undefined"!=typeof document&&(document.body.style.overflow="hidden"),fetch(h.Z.getIconLink(this.props.icon.refId,this.props.icon.slug,"fetch")).then(e=>e.text()).then(e=>{e=this.preprocessSVG(e),this.parseColors(e),this.refs.icon.innerHTML=e;let t=document.querySelector("#icon svg");t.innerHTML='<g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier">'.concat(t.innerHTML,"</g>");let s=t.getAttribute("viewBox");this.defaultViewBox=s,t.setAttribute("width",this.state.size+"px"),t.setAttribute("height",this.state.size+"px"),this.changeColor("#000000","line"),this.changeThickness(0),"dark"==this.state.theme?(this.changeColor("#ffffff","line"),this.changeThickness(0)):"light"==this.state.theme&&(this.changeColor("#000000","line"),this.changeThickness(0)),this.setState({loading:!1})}),window.addEventListener("keydown",this.onCMDK,!1),this.isMacLike=/(Mac|iPhone|iPod|iPad)/i.test(window.navigator.platform))}componentWillUnmount(){document.body.style.overflow="unset",window.removeEventListener("keydown",this.onCMDK,!1)}preprocessSVG(e){e="<svg "+e.split("<svg ")[1].replace(/\s+/g," ").trim();let t=/rgb\(.*?\)/g;if(e.match(t)){let s=(e,t,s)=>"#"+(16777216|e<<16|t<<8|s).toString(16).slice(1);e.match(t).forEach((t,i)=>{let[r,a,n]=t.match(/\d+/g);e=e.replace(t,s(r,a,n)).replace(t,s(r,a,n)).replace(t,s(r,a,n)).replace(t,s(r,a,n))})}return e}parseColors(e){let t=/(?:#)[0-9a-f]{8}|(?:#)[0-9a-f]{6}|(?:#)[0-9a-f]{4}|(?:#)[0-9a-f]{3}/ig;if(e.match(t)){let s=e.match(t).filter((e,t,s)=>s.indexOf(e)===t);this.setState({colors:s})}}changeTheme(e){this.setState({theme:e}),"dark"==e?"#000000"==this.state.color&&this.changeColor("#ffffff","line"):"light"==e&&"#ffffff"==this.state.color&&this.changeColor("#000000","line")}changeSize(e){this.setState({size:e});let t=document.querySelector("#icon svg");t.setAttribute("width",e+"px"),t.setAttribute("height",e+"px")}changePadding(e,t,s){t&&"none"!=t&&e<10&&(e=10),this.setState({padding:e});let i=document.querySelector("#icon svg"),r=this.defaultViewBox.split(" "),a=Number(r[2])*(Number(e)/100),n=Number(Number(r[2])+2*a.toFixed(2)).toFixed(2);i.setAttribute("viewBox","".concat(-a.toFixed(2)," ").concat(-a.toFixed(2)," ").concat(n," ").concat(n));let l=t||this.state.bgShape,o=document.getElementById("SVGRepo_bgCarrier");"none"==l?o.innerHTML="":"square"==l?o.innerHTML='<rect x="'.concat(-a.toFixed(2),'" y="').concat(-a.toFixed(2),'" width="').concat(n,'" height="').concat(n,'" rx="').concat(Number(n)*this.state.bgSquareRadius/100,'" fill="').concat(this.state.bgFill,'" strokeWidth="0"/>'):"hexagon"==l?o.innerHTML='<path transform="translate('.concat(-a.toFixed(2),", ").concat(-a.toFixed(2),"), scale(").concat(r[2]/16*(n/r[2]),')" fill="').concat(this.state.bgFill,'" d="M9.166.33a2.25 2.25 0 00-2.332 0l-5.25 3.182A2.25 2.25 0 00.5 5.436v5.128a2.25 2.25 0 001.084 1.924l5.25 3.182a2.25 2.25 0 002.332 0l5.25-3.182a2.25 2.25 0 001.084-1.924V5.436a2.25 2.25 0 00-1.084-1.924L9.166.33z" strokeWidth="0"/>'):"circle"==l?o.innerHTML='<rect x="'.concat(-a.toFixed(2),'" y="').concat(-a.toFixed(2),'" width="').concat(n,'" height="').concat(n,'" rx="').concat(.5*Number(n),'" fill="').concat(this.state.bgFill,'" strokeWidth="0"/>'):"blob"==l&&((s||!this.blobPath)&&(this.blobPath=this.generateNewBlob(32)),o.innerHTML='<path transform="translate('.concat(-a.toFixed(2),", ").concat(-a.toFixed(2),"), scale(").concat(r[2]/32*(n/r[2]),')" d="').concat(this.blobPath,'" fill="').concat(this.state.bgFill,'" strokeWidth="0"/>'))}changeColor(e,t){let s=document.querySelector("#icon svg");if("line"==t)"#000000"!=e?this.setState({color:e,valuesChanged:!0}):this.setState({color:e}),"none"!=s.getAttribute("fill")&&s.setAttribute("fill","".concat(e)),this.state.valuesChanged&&"none"!=s.getAttribute("stroke")&&s.setAttribute("stroke","".concat(e));else if("trace"==t)this.setState({traceColor:e}),this.changeTraceWidth(this.state.traceWidth);else{let i=this.state.colors;document.querySelector("#icon svg").innerHTML=s.innerHTML.replace(RegExp(i[t],"g"),e),i[t]=e,this.setState({colors:i})}}changeThickness(e){0!=e?this.setState({thickness:e,valuesChanged:!0}):this.setState({thickness:e}),this.state.valuesChanged&&0==e&&(e=.01);let t=document.querySelector("#icon svg"),s=Number(this.defaultViewBox.split(" ")[2])*(Number(e)/100),i=document.querySelector("#SVGRepo_iconCarrier"),r=i.innerHTML;this.state.valuesChanged&&(r.includes("stroke-width")&&!r.includes('stroke-width="0"')?(r=(r=(r=r.replace(RegExp('stroke="none"',"g"),"")).replace(RegExp("stroke:none;","g"),"")).replace(RegExp('stroke-width="(.*?)"',"g"),'stroke-width="'.concat(s/10,'"')),i.innerHTML=r.replace(RegExp("stroke-width:(.*?);","g"),"stroke-width:".concat(s/10,";"))):(t.setAttribute("stroke","".concat(this.state.color)),t.setAttribute("stroke-width",s/10)))}changeTraceWidth(e){this.setState({traceWidth:e});let t=document.querySelector("#SVGRepo_tracerCarrier"),s=document.querySelector("#SVGRepo_iconCarrier");if(0==e)t.innerHTML="";else{let i=Number(this.defaultViewBox.split(" ")[2])*(Number(e)/100)/5;t.innerHTML=s.innerHTML,t.setAttribute("stroke","".concat(this.state.traceColor)),t.setAttribute("stroke-width",i)}}changeFlip(e,t){if(this.state.flip!=t){this.setState({flip:t});let s=document.querySelector("#icon svg"),i=s.getAttribute("transform")||"",r="";r=i.includes("matrix")?i.replace(/matrix\(.*?\)/g,e):i+e,s.setAttribute("transform",r)}}changeBGSquareRadius(e){this.setState({bgSquareRadius:e}),this.changeBGShape("square")}changeRotate(e,t){if(this.state.rotate!=t){this.setState({rotate:t});let s=document.querySelector("#icon svg"),i=s.getAttribute("transform")||"",r="";r=i.includes("rotate")?i.replace(/rotate\(.*?\)/g,e):i+e,s.setAttribute("transform",r)}}generateNewBlob(e){let t=N.svgPath({seed:Math.random(),extraPoints:S(4,12),randomness:S(4,10),size:Number(e)});return this.setState({blobPath:t}),t}changeBGShape(e){"none"!=this.state.bgShape&&(this.setState({bgShape:"none"}),this.changePadding(this.state.padding,"none")),setTimeout(()=>{this.state.bgShape!=e&&(this.setState({bgShape:e}),"blob"==e?this.changePadding(this.state.padding,e,!0):this.changePadding(this.state.padding,e)),clearTimeout(this.bgShapeTimeout),this.bgShapeTimeout=setTimeout(()=>{this.setState({delayedBgShape:e})},50)},1)}changeBGFill(e){if(this.state.bgFill!=e){this.setState({bgFill:e});let t=document.querySelector("#SVGRepo_bgCarrier rect");t||(t=document.querySelector("#SVGRepo_bgCarrier path")),t.setAttribute("fill",e)}}changeBGPadding(e){if(this.state.bgPadding!=e){this.setState({bgPadding:e});let t=document.querySelector("#SVGRepo_bgCarrier");if(t){let s=(this.defaultViewBox.split(" ")[2]-this.defaultViewBox.split(" ")[2]*((100-e)/100))/2;t.setAttribute("transform","translate(".concat(s,",").concat(s,"), scale(").concat((100-e)/100,")"))}}}closeEditor(){this.setState({loading:!0}),setTimeout(()=>{this.props.dismiss()},300)}copySVGCode(){this.setState({copy:!0}),w()(this.refs.icon.innerHTML.replace(' width="200px" height="200px"',"")),setTimeout(()=>{this.setState({copy:!1})},1e3)}exportAsSVG(){!function(e,t){try{new Blob}catch(e){alert("Your browser doesn't support file saver!")}var s=e.cloneNode(!0),i=document.implementation.createDocumentType("svg","-//W3C//DTD SVG 1.1//EN","http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"),r=document.implementation.createDocument("http://www.w3.org/2000/svg","svg",i);r.replaceChild(s,r.documentElement);var a=new XMLSerializer().serializeToString(r);a=(a=(a=(a=(a=a.replace(/></g,">\n\r<")).replace(RegExp('width="200px"',"i"),'width="800px"')).replace(RegExp('height="200px"',"i"),'height="800px"')).replace(RegExp("<svg ","g"),"<!--XX-->\n<svg ")).replace(RegExp("<!--(.*?)-->","g"),"<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->");var n=new Blob([a]);(0,_.saveAs)(n,t+"-svgrepo-com.svg")}(document.querySelector("#icon svg"),this.props.icon.slug)}exportAsPNG(e){var t,s;let i,r;t=document.querySelector("#icon svg"),s=this.props.icon.slug,r=Number((i=t.getAttribute("viewBox").split(" "))[2]),(0,k.saveSvgAsPng)(t,s+"-svgrepo-com.png",{scale:e/r,left:i[0],top:i[1]})}render(){return(0,i.jsxs)("div",{className:this.state.loading?b().editorHolderLoading:b().editorHolder,children:[(0,i.jsx)("div",{className:b().backgroundPanel,onClick:()=>this.closeEditor()}),this.props.icon&&(0,i.jsxs)("div",{className:"dark"==this.state.theme?b().editor+" "+b().darkEditMode:b().editor,children:[(0,i.jsx)("div",{className:b().editorClose,onClick:()=>this.closeEditor(),children:(0,i.jsx)(C,{slug:"close",width:26,height:26})}),this.state.loading&&(0,i.jsx)("div",{className:b().loading,children:(0,i.jsx)(C,{slug:"loading",width:26,height:26})}),(0,i.jsxs)("div",{className:b().editorContent,children:[(0,i.jsxs)("div",{className:b().editorLeft,children:[(0,i.jsxs)("div",{className:b().previewCarrier,style:{backgroundColor:"dark"==this.state.theme?"#222222":"#ffffff"},children:[(0,i.jsxs)("div",{className:b().theme,children:[(0,i.jsx)("div",{className:b().themeLight,onClick:()=>this.changeTheme("light"),children:(0,i.jsx)("span",{children:"Light"})}),(0,i.jsx)("div",{className:b().themeDark,onClick:()=>this.changeTheme("dark"),children:(0,i.jsx)("span",{children:"Dark"})})]}),(0,i.jsx)("div",{className:b().previewBorderLeft}),(0,i.jsxs)("div",{children:[(0,i.jsx)("div",{className:b().previewBorderTop,children:(0,i.jsx)("div",{className:b().borderHorizontal})}),(0,i.jsx)("div",{className:b().preview,ref:"icon",id:"icon"}),(0,i.jsx)("div",{className:b().previewBorderBottom,children:(0,i.jsx)("div",{className:b().borderHorizontal})})]}),(0,i.jsx)("div",{className:b().previewBorderRight})]}),(0,i.jsx)("div",{className:b().pref+" "+b().colorSelection,children:this.state.colors.map((e,t)=>(0,i.jsx)("div",{className:b().prefItem,children:(0,i.jsxs)("div",{className:b().prefPicker,children:[(0,i.jsx)("input",{type:"color",id:"vectorColor-"+t,name:"vectorColor-"+t,defaultValue:e,value:e,onChange:e=>this.changeColor(e.target.value,t)}),(0,i.jsx)("input",{type:"text",className:b().prefSelect+" "+b().colorInput,value:e,placeholder:"HEX, RGB or HSL",onChange:e=>this.changeColor(e.target.value,t)})]})},"color-"+t))})]}),(0,i.jsxs)("div",{className:b().editorRight,children:[(0,i.jsxs)("div",{className:b().pref,children:[(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"Icon Size"}),(0,i.jsxs)("div",{className:b().prefPicker+" "+b().sliderCarrier,children:[(0,i.jsx)("input",{type:"range",min:"64",max:"256",defaultValue:"200",className:b().slider,value:this.state.size,onChange:e=>this.changeSize(e.target.value)}),(0,i.jsxs)("div",{className:b().prefPickerText,children:[this.state.size,"px"]})]})]}),(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"Padding"}),(0,i.jsxs)("div",{className:b().prefPicker+" "+b().sliderCarrier,children:[(0,i.jsx)("input",{type:"range",min:"0",max:"100",defaultValue:"0",className:b().slider,value:this.state.padding,onChange:e=>this.changePadding(e.target.value)}),(0,i.jsxs)("div",{className:b().prefPickerText,children:[this.state.padding,"%"]})]})]}),(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"Thickness"}),(0,i.jsxs)("div",{className:b().prefPicker+" "+b().sliderCarrier,children:[(0,i.jsx)("input",{type:"range",min:"0",max:"100",defaultValue:"0",className:b().slider,value:this.state.thickness,onChange:e=>this.changeThickness(e.target.value)}),(0,i.jsxs)("div",{className:b().prefPickerText,children:[this.state.thickness,"%"]})]})]}),(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"Line Color"}),(0,i.jsxs)("div",{className:b().prefPicker,children:[(0,i.jsx)("input",{type:"color",id:"head",name:"head",value:this.state.color,defaultValue:"#000000",onChange:e=>this.changeColor(e.target.value,"line")}),(0,i.jsx)("input",{type:"text",className:b().prefSelect+" "+b().colorInput,value:this.state.color,placeholder:"HEX, RGB or HSL",onChange:e=>this.changeColor(e.target.value,"line")})]})]}),(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"Flip/Mirror"}),(0,i.jsx)("div",{className:b().prefPicker,children:(0,i.jsxs)("div",{className:b().prefSelect,children:[(0,i.jsx)("div",{onClick:()=>this.changeFlip("matrix(1, 0, 0, 1, 0, 0)","11"),title:"Original",className:"11"==this.state.flip?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"flip",width:16,height:16,transform:"matrix(1, 0, 0, 1, 0, 0)"})}),(0,i.jsx)("div",{onClick:()=>this.changeFlip("matrix(-1, 0, 0, 1, 0, 0)","-11"),title:"Horizontal",className:"-11"==this.state.flip?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"flip",width:16,height:16,transform:"matrix(-1, 0, 0, 1, 0, 0)"})}),(0,i.jsx)("div",{onClick:()=>this.changeFlip("matrix(1, 0, 0, -1, 0, 0)","1-1"),title:"Vertical",className:"1-1"==this.state.flip?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"flip",width:16,height:16,transform:"matrix(1, 0, 0, -1, 0, 0)"})}),(0,i.jsx)("div",{onClick:()=>this.changeFlip("matrix(-1, 0, 0, -1, 0, 0)","-1-1"),title:"Horizontal-Vertical",className:"-1-1"==this.state.flip?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"flip",width:16,height:16,transform:"matrix(-1, 0, 0, -1, 0, 0)"})})]})})]}),(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"Rotation"}),(0,i.jsx)("div",{className:b().prefPicker,children:(0,i.jsxs)("div",{className:b().prefSelect,children:[(0,i.jsx)("div",{onClick:()=>this.changeRotate("rotate(0)",0),title:"Original",className:0==this.state.rotate?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"rotate",width:16,height:16,transform:"rotate(0)"})}),(0,i.jsx)("div",{onClick:()=>this.changeRotate("rotate(90)",90),title:"Rotate 90deg",className:90==this.state.rotate?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"rotate",width:16,height:16,transform:"rotate(90)"})}),(0,i.jsx)("div",{onClick:()=>this.changeRotate("rotate(180)",180),title:"Rotate 180deg",className:180==this.state.rotate?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"rotate",width:16,height:16,transform:"rotate(180)"})}),(0,i.jsx)("div",{onClick:()=>this.changeRotate("rotate(270)",270),title:"Rotate 270deg",className:270==this.state.rotate?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"rotate",width:16,height:16,transform:"rotate(270)"})})]})})]}),(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"Diagonal"}),(0,i.jsx)("div",{className:b().prefPicker,children:(0,i.jsxs)("div",{className:b().prefSelect,children:[(0,i.jsx)("div",{onClick:()=>this.changeRotate("rotate(0)",0),title:"Original",className:0==this.state.rotate?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"rotate:arrow",width:16,height:16,transform:"rotate(0)"})}),(0,i.jsx)("div",{onClick:()=>this.changeRotate("rotate(45)",45),title:"Rotate 45deg",className:45==this.state.rotate?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"rotate:arrow",width:16,height:16,transform:"rotate(45)"})}),(0,i.jsx)("div",{onClick:()=>this.changeRotate("rotate(-45)",-45),title:"Rotate 225deg",className:-45==this.state.rotate?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"rotate:arrow",width:16,height:16,transform:"rotate(-45)"})})]})})]}),(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"BG Shape"}),(0,i.jsx)("div",{className:b().prefPicker,children:(0,i.jsxs)("div",{className:b().prefSelect,children:[(0,i.jsx)("div",{onClick:()=>this.changeBGShape("none"),title:"None",className:"none"==this.state.bgShape?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"bg:none",width:16,height:16})}),(0,i.jsx)("div",{onClick:()=>this.changeBGShape("square"),title:"Square",className:"square"==this.state.bgShape?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"bg:square",width:16,height:16})}),(0,i.jsx)("div",{onClick:()=>this.changeBGShape("hexagon"),title:"Hexagon",className:"hexagon"==this.state.bgShape?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"bg:hexagon",width:16,height:16})}),(0,i.jsx)("div",{onClick:()=>this.changeBGShape("circle"),title:"Circle",className:"circle"==this.state.bgShape?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"bg:circle",width:16,height:16})}),(0,i.jsx)("div",{onClick:()=>this.changeBGShape("blob"),title:"Blob",className:"blob"==this.state.bgShape?b().segmentActive:b().segment,children:(0,i.jsx)(C,{slug:"bg:blob",width:16,height:16})})]})})]}),"blob"==this.state.delayedBgShape&&(0,i.jsxs)("div",{className:b().prefItem,style:{height:32,marginBottom:10},children:[(0,i.jsx)("div",{className:b().prefTitle}),(0,i.jsx)("div",{className:b().prefPicker,children:(0,i.jsxs)("div",{className:"button buttonSmall",style:{paddingLeft:38,paddingRight:38},onClick:()=>this.changeBGShape("blob"),children:[(0,i.jsx)(C,{slug:"random",width:15,height:15})," ",(0,i.jsx)("span",{style:{fontWeight:600,fontSize:12,position:"relative",top:1},children:"REGENERATE BLOB"})]})})]}),"square"==this.state.delayedBgShape&&(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"BG Radius"}),(0,i.jsxs)("div",{className:b().prefPicker+" "+b().sliderCarrier,children:[(0,i.jsx)("input",{type:"range",min:"0",max:"50",defaultValue:"0",className:b().slider,value:this.state.bgSquareRadius,onChange:e=>this.changeBGSquareRadius(e.target.value)}),(0,i.jsxs)("div",{className:b().prefPickerText,children:[this.state.bgSquareRadius,"%"]})]})]}),"none"!=this.state.delayedBgShape&&(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"BG Color"}),(0,i.jsxs)("div",{className:b().prefPicker,children:[(0,i.jsx)("input",{type:"color",id:"bgFill",name:"bgFill",value:this.state.bgFill,onChange:e=>this.changeBGFill(e.target.value)}),(0,i.jsx)("label",{htmlFor:"bgFill",children:(0,i.jsx)("div",{className:b().colorWheel,style:{backgroundColor:this.state.bgFill}})}),(0,i.jsx)("input",{type:"text",className:b().prefSelect+" "+b().colorInput,value:this.state.bgFill,placeholder:"HEX, RGB or HSL",onChange:e=>this.changeBGFill(e.target.value)})]})]}),"none"!=this.state.delayedBgShape&&(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"BG Padding"}),(0,i.jsxs)("div",{className:b().prefPicker+" "+b().sliderCarrier,children:[(0,i.jsx)("input",{type:"range",min:"0",max:"100",defaultValue:"0",className:b().slider,value:this.state.bgPadding,onChange:e=>this.changeBGPadding(e.target.value)}),(0,i.jsxs)("div",{className:b().prefPickerText,children:[this.state.bgPadding,"%"]})]})]}),(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"Trace Width"}),(0,i.jsxs)("div",{className:b().prefPicker+" "+b().sliderCarrier,children:[(0,i.jsx)("input",{type:"range",min:"0",max:"100",defaultValue:"0",className:b().slider,value:this.state.traceWidth,onChange:e=>this.changeTraceWidth(e.target.value)}),(0,i.jsxs)("div",{className:b().prefPickerText,children:[this.state.traceWidth,"%"]})]})]}),0!=this.state.traceWidth&&(0,i.jsxs)("div",{className:b().prefItem,children:[(0,i.jsx)("div",{className:b().prefTitle,children:"Trace Color"}),(0,i.jsxs)("div",{className:b().prefPicker,children:[(0,i.jsx)("input",{type:"color",id:"head",name:"head",value:this.state.traceColor,defaultValue:"#CCCCCC",onChange:e=>this.changeColor(e.target.value,"trace")}),(0,i.jsx)("input",{type:"text",className:b().prefSelect+" "+b().colorInput,value:this.state.traceColor,placeholder:"HEX, RGB or HSL",onChange:e=>this.changeColor(e.target.value,"trace")})]})]})]}),(0,i.jsx)("div",{className:b().exportCarrierMobilePlaceholder})]})]}),(0,i.jsx)("div",{className:b().exportCarrier,children:(0,i.jsxs)("div",{className:b().export,children:[(0,i.jsxs)("div",{className:"button",onClick:()=>this.copySVGCode(),style:{background:this.state.copy?"#e5fff4":"inherit"},children:[(0,i.jsxs)("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"#0094dd",strokeWidth:"2",strokeLinecap:"square",strokeLinejoin:"arcs",children:[(0,i.jsx)("rect",{x:"9",y:"9",width:"13",height:"13",rx:"2",ry:"2"}),(0,i.jsx)("path",{d:"M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"})]}),(0,i.jsx)("span",{children:this.state.copy?"Copied!":"Copy SVG"})]}),(0,i.jsxs)("div",{className:"button buttonActive",style:{paddingRight:35},children:[(0,i.jsxs)("label",{onClick:()=>this.exportAsSVG(),style:{width:"100%",width:"100%",display:"flex",justifyContent:"center",alignItems:"center",cursor:"pointer"},children:[(0,i.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"#000","stroke-width":"3",strokeLinecap:"round",strokeLinejoin:"round",children:(0,i.jsx)("path",{d:"M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 9l-5 5-5-5M12 12.8V2.5"})}),(0,i.jsx)("span",{style:{paddingTop:9,paddingBottom:9},children:"Export"})]}),(0,i.jsx)("div",{className:"buttonExtra",children:(0,i.jsx)("svg",{height:"18",width:"18",viewBox:"0 0 24 24",stroke:"#fff",fill:"none",transform:"rotate(270)",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"arcs",style:{marginLeft:5},children:(0,i.jsx)("path",{d:"M9 18l6-6-6-6"})})}),(0,i.jsxs)("div",{className:"buttonOptions",style:{top:-150},children:[(0,i.jsxs)("li",{onClick:()=>this.exportAsSVG(),children:["SVG ",(0,i.jsx)("span",{children:"Optimized"})]}),(0,i.jsxs)("li",{onClick:()=>this.exportAsPNG(256),children:["PNG ",(0,i.jsx)("span",{children:"256x256"})]}),(0,i.jsxs)("li",{onClick:()=>this.exportAsPNG(512),children:["PNG ",(0,i.jsx)("span",{children:"512x512"})]}),(0,i.jsxs)("li",{onClick:()=>this.exportAsPNG(1024),children:["PNG ",(0,i.jsx)("span",{children:"1024x1024"})]})]})]})]})})]})]})}constructor(...e){super(...e),this.state={theme:"light",size:200,padding:0,color:"#000000",thickness:0,valuesChanged:!1,flip:"11",rotate:0,loading:!!this.props.icon,copy:!1,copyarea:"",bgShape:"none",delayedBgShape:"none",bgFill:"#7ed0ec",bgSquareRadius:0,bgPadding:0,traceWidth:0,traceColor:"#CCCCCC",colors:[]}}}var V=s(2629),B=s(1148),G=!0;function P(e){let{ssrIcon:t}=e,[s,n]=(0,r.useState)(t),[o,g]=(0,r.useState)(!1),[m,j]=(0,r.useState)(!1),[w,C]=(0,r.useState)(Array(20).fill(!1)),[_,k]=(0,r.useState)(null),[S,N]=(0,r.useState)(!1),[y,b]=(0,r.useState)(!1),G=(0,a.useRouter)();(0,r.useEffect)(()=>{h.Z.isAdmin()&&b(!0),g(h.Z.checkSavedStatus(t.id))},[]),(0,r.useEffect)(()=>{let e=e=>{e.includes("/download/")||e.replace("?edit=true","")==G.asPath.replace("?edit=true","")||(window.scrollTo(0,0),N(!0))},t=()=>{S&&N(!1)};return G.events.on("routeChangeStart",e),G.events.on("routeChangeComplete",t),()=>{G.events.off("routeChangeStart",e),G.events.off("routeChangeComplete",t)}},[G]),(0,r.useEffect)(()=>{G.query.edit&&P(!0),t.id!=s.id&&(n(t),g(h.Z.checkSavedStatus(t.id))),(async()=>{let e=await fetch("https://api.svgrepo.com/svg/".concat(t.id,"/").concat(t.slug)).then(e=>e.json());n(e.icon),C((await fetch("https://api.svgrepo.com/collection/?term=".concat(e.icon.data_pack,"&limit=20")).then(e=>e.json())).icons)})()},[t]);let P=e=>{e||G.push("/svg/".concat(t.id,"/").concat(t.slug)),j(e)},T=async()=>{"done"==(await fetch("/api/admin/svg/delete/".concat(s.id,"/").concat(h.Z.getAdminKey())).then(e=>e.json())).message&&window.close()},A="/show/".concat(s.id,"/").concat(x()(s.title,{replacement:"-",lower:!0,remove:/[*+~.()'"!:@,]/g}),".svg"),M=(0,d.Z)(s.title.replace(/-/g," ").split("&")[0]),R=s?s.same:"";1==R&&(R=null);let F="";R&&(F=" "+R);let z="SVG Vector",H="/collections/";s.data_pack&&(z=(0,d.Z)(s.data_pack.replace(/-/g," ")),H="/collection/"+s.data_pack+"/");let E="CC0",I="SVG Repo";s.license&&(E=s.license,I=s.license_owner,s.license_link);let q=R?" ("+R+")":"";return(0,i.jsxs)(u.Z,{children:[(0,i.jsx)(v.Z,{links:[{title:"Home",link:"/"},{title:z,link:H},{title:M,link:"/svg/".concat(t.id,"/").concat(t.slug)}]}),(0,i.jsx)(B.Z,{title:"".concat(M," Vector SVG Icon").concat(q),description:"Free ".concat(M).concat(q," Vector Icon in SVG format. ✅ Download Free ").concat(M).concat(q," Vector and icons for commercial use. ").concat(M).concat(q," SVG vector illustration graphic art design format.").concat(z," vectors."),canonical:"/svg/".concat(t.id,"/").concat(t.slug)}),(0,i.jsxs)("div",{className:p().contentHolder,style:{opacity:S?.7:1},children:[(0,i.jsxs)("div",{className:p().mediaDescription,children:[(0,i.jsxs)("h1",{children:[M," SVG Vector ",R&&(0,i.jsx)("span",{children:R})]}),(0,i.jsxs)("p",{className:"subtext",style:{marginBottom:5},children:["Free Download ",M,F," SVG vector file in monocolor and multicolor type for Sketch and Figma from ",M,F," Vectors svg vector collection. ",M,F," Vectors SVG vector illustration graphic art design format."]}),(0,i.jsxs)("ul",{className:p().manifest,children:[(0,i.jsxs)("li",{children:[(0,i.jsx)("b",{children:"COLLECTION:"})," ",(0,i.jsx)(l(),{href:H,children:z})]}),(0,i.jsxs)("li",{children:[(0,i.jsx)("b",{children:"LICENSE:"})," ",(0,i.jsxs)(l(),{target:"_blank",href:"/page/licensing/#".concat(E),children:[E," License"]})]}),(0,i.jsxs)("li",{children:[(0,i.jsxs)("b",{children:["SVG Repo"==I?"UPLOADER":"AUTHOR",":"]})," ",(0,i.jsx)(l(),{href:"SVG Repo"==I?"/":"/author/".concat(I,"/"),children:I})]}),(0,i.jsx)("li",{className:p().tags,children:s.tags?s.tags.split(",").map((e,t)=>(0,i.jsx)(l(),{className:"tag",style:0==t?{marginLeft:0}:{},href:"/vectors/".concat(e.replace(/ /g,"-").toLowerCase(),"/"),children:e.replace(/-/g," ").toLowerCase()},t)):(0,i.jsx)(l(),{className:"tag",style:{marginLeft:0},href:"/vectors/".concat(s.title.replace(/ /g,"-").toLowerCase(),"/"),children:s.title.replace(/-/g," ").toLowerCase()},0)})]}),(0,i.jsxs)("div",{className:p().buttons,children:[(0,i.jsx)("div",{children:(0,i.jsxs)("div",{className:"button buttonActive",style:{paddingRight:35},children:[(0,i.jsxs)(l(),{href:"/download/".concat(s.id,"/").concat(s.slug,".svg"),style:{width:"100%",width:"100%",display:"flex",justifyContent:"center",alignItems:"center",height:"100%"},children:[(0,i.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"#000",strokeWidth:"3",strokeLinecap:"round",strokeLinecap:"round",children:(0,i.jsx)("path",{d:"M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 9l-5 5-5-5M12 12.8V2.5"})}),(0,i.jsxs)("span",{children:["Download SVG",(0,i.jsx)("span",{children:" Vector"})]})]}),(0,i.jsx)("div",{className:"buttonExtra",children:(0,i.jsx)("svg",{height:"18",width:"18",viewBox:"0 0 24 24",stroke:"#fff",fill:"none",transform:"rotate(90)",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"arcs",style:{marginLeft:5},children:(0,i.jsx)("path",{d:"M9 18l6-6-6-6"})})}),(0,i.jsxs)("div",{className:"buttonOptions",children:[(0,i.jsx)(l(),{href:"/download/".concat(s.id,"/").concat(s.slug,".svg"),children:(0,i.jsxs)("li",{children:["SVG ",(0,i.jsx)("span",{children:"Optimized"})]})}),(0,i.jsx)(l(),{href:"/svg/".concat(s.id,"/").concat(s.slug,"?edit=true"),children:(0,i.jsxs)("li",{children:["PNG ",(0,i.jsx)("span",{children:"256x256"})]})}),(0,i.jsx)(l(),{href:"/svg/".concat(s.id,"/").concat(s.slug,"?edit=true"),children:(0,i.jsxs)("li",{children:["PNG ",(0,i.jsx)("span",{children:"512x512"})]})}),(0,i.jsx)(l(),{href:"/svg/".concat(s.id,"/").concat(s.slug,"?edit=true"),children:(0,i.jsxs)("li",{children:["PNG ",(0,i.jsx)("span",{children:"1024x1024"})]})})]})]})}),(0,i.jsx)("div",{style:{width:15}}),(0,i.jsxs)("div",{className:"button",onClick:()=>{h.Z.saveVector(s.id,s.slug),g(!o)},children:[(0,i.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:o?"#555":"none",stroke:"#000",strokeWidth:"3",strokeLinecap:"round",strokeLinecap:"round",children:(0,i.jsx)("path",{d:"M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"})}),(0,i.jsx)("span",{children:o?"Saved":"Save"})]})]})]}),(0,i.jsxs)("div",{className:p().mediaContent,itemScope:!0,itemType:"http://schema.org/ImageObject",children:[(0,i.jsx)(c(),{src:A,style:{width:250,height:250},width:250,height:250,alt:"".concat(M," SVG Vector Icon"),priority:!0}),(0,i.jsxs)("div",{className:p().mediaButtons,children:[(0,i.jsx)(l(),{href:"/svg/".concat(t.id,"/").concat(t.slug,"?edit=true"),children:(0,i.jsxs)("div",{className:"button buttonSmall",onClick:()=>P(!0),children:[(0,i.jsxs)("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"#000",strokeWidth:"2",strokeLinecap:"round",strokeLinecap:"round",children:[(0,i.jsx)("circle",{cx:"13.5",cy:"6.5",r:".5"}),(0,i.jsx)("circle",{cx:"17.5",cy:"10.5",r:".5"}),(0,i.jsx)("circle",{cx:"8.5",cy:"7.5",r:".5"}),(0,i.jsx)("circle",{cx:"6.5",cy:"12.5",r:".5"}),(0,i.jsx)("path",{d:"M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 011.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z"})]}),(0,i.jsx)("span",{children:"Edit Vector"})]})}),(0,i.jsx)("span",{itemProp:"creator",itemScope:!0,itemType:"http://schema.org/Organization",children:(0,i.jsx)("meta",{itemProp:"name",content:"SVG Repo"})}),(0,i.jsx)("meta",{itemProp:"author",content:"SVG Repo"}),(0,i.jsx)("meta",{itemProp:"name",content:"".concat(M," SVG Vector Icon")}),(0,i.jsx)("meta",{itemProp:"contentUrl",content:"https://www.svgrepo.com"+A}),(0,i.jsx)("meta",{itemProp:"creditText",content:"SVG Repo"}),(0,i.jsx)("meta",{itemProp:"copyrightNotice",content:E}),(0,i.jsx)("meta",{itemProp:"license",content:"https://www.svgrepo.com/page/licensing/#".concat(E)}),(0,i.jsx)("meta",{itemProp:"acquireLicensePage",content:"https://www.svgrepo.com/page/licensing/#".concat(E)}),(0,i.jsx)("meta",{itemProp:"url",content:"https://www.svgrepo.com/svg/".concat(t.id,"/").concat(t.slug)})]}),(0,i.jsx)("div",{children:y&&(0,i.jsxs)("div",{className:"button buttonSmall",onClick:()=>T(),style:{position:"absolute",bottom:10,right:10},children:[(0,i.jsx)("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"#000",strokeWidth:"2",strokeLinecap:"round",strokeLinecap:"round",children:(0,i.jsx)("path",{d:"M12,11.2928932 L16.1464466,7.14644661 C16.3417088,6.95118446 16.6582912,6.95118446 16.8535534,7.14644661 C17.0488155,7.34170876 17.0488155,7.65829124 16.8535534,7.85355339 L12.7071068,12 L16.8535534,16.1464466 C17.0488155,16.3417088 17.0488155,16.6582912 16.8535534,16.8535534 C16.6582912,17.0488155 16.3417088,17.0488155 16.1464466,16.8535534 L12,12.7071068 L7.85355339,16.8535534 C7.65829124,17.0488155 7.34170876,17.0488155 7.14644661,16.8535534 C6.95118446,16.6582912 6.95118446,16.3417088 7.14644661,16.1464466 L11.2928932,12 L7.14644661,7.85355339 C6.95118446,7.65829124 6.95118446,7.34170876 7.14644661,7.14644661 C7.34170876,6.95118446 7.65829124,6.95118446 7.85355339,7.14644661 L12,11.2928932 Z"})}),(0,i.jsx)("span",{children:"Delete"})]})})]})]}),m&&(0,i.jsx)(L,{icon:{slug:s.slug,refId:s.id},dismiss:()=>P(!1)}),(0,i.jsx)(V.Z,{id:"native-vector-".concat(s.id),sendUrl:e=>k(e),fallbackCarbon:!0}),(0,i.jsx)("div",{className:"carrier",children:(0,i.jsxs)("div",{className:"content",children:[(0,i.jsxs)("div",{className:"compact",children:[(0,i.jsxs)("h2",{children:[z," SVG Vectors"]}),(0,i.jsxs)("p",{className:"description",children:[M," SVG Vector is a part of ",z," vector collection. Following vectors are from the same pack as this vector also checkout all ",z," icons and vectors."]})]}),(0,i.jsx)(f.Z,{nodes:w,loading:S,sentUrl:_}),(0,i.jsx)(l(),{href:H,children:(0,i.jsxs)("div",{className:"button",style:{marginBottom:15},children:[(0,i.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"#000",strokeWidth:"3",strokeLinecap:"round",strokeLinecap:"round",children:(0,i.jsx)("path",{d:"M5 12h13M12 5l7 7-7 7"})}),(0,i.jsx)("span",{children:"See All Collection"})]})}),(0,i.jsx)(V.Z,{id:"native-vector-".concat(s.id,"-2")}),(0,i.jsxs)("h2",{children:[M," SVG Vectors"]}),(0,i.jsxs)("p",{className:"description",children:["Checkout other ",M," Vectors with different styles in SVG vector and icon library."]}),(0,i.jsx)(f.Z,{nodes:s.similar,loading:S,sentUrl:_}),(0,i.jsx)(l(),{href:"/vectors/".concat(s.slug,"/"),children:(0,i.jsxs)("div",{className:"button",children:[(0,i.jsx)("svg",{width:"18",height:"18",viewBox:"0 0 24 24",fill:"none",stroke:"#000",strokeWidth:"3",strokeLinecap:"round",strokeLinecap:"round",children:(0,i.jsx)("path",{d:"M5 12h13M12 5l7 7-7 7"})}),(0,i.jsxs)("span",{children:["See More ",(0,i.jsxs)("span",{children:[M," "]}),"Vectors"]})]})})]})})]})}let T={runtime:"experimental-edge"}},1697:function(e){e.exports={editorHolder:"style_editorHolder__6AYHY",backgroundPanel:"style_backgroundPanel__iZFLF",editorHolderLoading:"style_editorHolderLoading__JxOCA",editorLeft:"style_editorLeft__DMhnF",editorRight:"style_editorRight__rpzCB",editorClose:"style_editorClose__7uxp1",editor:"style_editor__1EhRs",loading:"style_loading__Dqqse",rotating:"style_rotating__2f6OB",previewCarrier:"style_previewCarrier__8GfO1",preview:"style_preview__73y6e",previewBorderLeft:"style_previewBorderLeft__4ajWu",previewBorderRight:"style_previewBorderRight__RKdem",previewBorderTop:"style_previewBorderTop__LFvIR",previewBorderBottom:"style_previewBorderBottom__Elgkn",darkEditMode:"style_darkEditMode__8DuIA",borderHorizontal:"style_borderHorizontal__5R926",theme:"style_theme__JQRrz",themeDark:"style_themeDark__DLw6X",darkmode:"style_darkmode__llNG3",themeLight:"style_themeLight__mFAA6",editorContent:"style_editorContent__GFOxE",prefItem:"style_prefItem__XVsLZ",prefTitle:"style_prefTitle__TvGG3",prefPicker:"style_prefPicker__1iNge",prefPickerText:"style_prefPickerText__KGfyj",prefSelect:"style_prefSelect__josu8",colorInput:"style_colorInput__ArCUg",segment:"style_segment__Au6oY",segmentActive:"style_segmentActive__DwpMx",download:"style_download__uZmG9",exportCarrier:"style_exportCarrier__vh3aJ",exportCarrierMobilePlaceholder:"style_exportCarrierMobilePlaceholder__9TVf8",export:"style_export__81Fd1",editorChoose:"style_editorChoose__z_0eh",copyBox:"style_copyBox__ZLtC3",popularPacks:"style_popularPacks__wc1TO",editAndDownload:"style_editAndDownload__LHzsE",desktopOnly:"style_desktopOnly__IrDYT",colorSelection:"style_colorSelection__upHlk",sliderCarrier:"style_sliderCarrier__1gBYt",slideRatio:"style_slideRatio__m9HS1",slider:"style_slider__O_D0K",layout:"style_layout__TjIs7"}},6057:function(e){e.exports={loading:"style_loading__ImzqA"}},4956:function(e){e.exports={Node:"style_Node__GkK82",NodeImage:"style_NodeImage__FiBL5",action:"style_action__wYD0A",saved:"style_saved__BM3Li",actionTitle:"style_actionTitle__o1rFS"}},3374:function(e){e.exports={nodeListing:"style_nodeListing__7Nmro",nodeListingPlugin:"style_nodeListingPlugin__79VCC"}},4188:function(e){e.exports={contentHolder:"styles_contentHolder__tGZ_5",mediaContent:"styles_mediaContent__xVExe",mediaDescription:"styles_mediaDescription__RUGi3",mediaButtons:"styles_mediaButtons__gS452",mediaButton:"styles_mediaButton__RwUH3",buttons:"styles_buttons__BCMQN",manifest:"styles_manifest__YTzNu",tags:"styles_tags__Ng0DG",smallTitleCarrier:"styles_smallTitleCarrier__dWo_t",seeMore:"styles_seeMore__JLsVr"}}},function(e){e.O(0,[914,675,962,28,454,774,888,179],function(){return e(e.s=7312)}),_N_E=e.O()}]);